<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>尋寶隊的寶物</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<script
  src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
  integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="
  crossorigin="anonymous"></script>
  
<script type="text/javascript" language="javascript">
//global
time = new Date();
time = time.getTime();
version='150809';
gg=[];
tmp='';
cc=0;
//global2
aryset=nanodesu();
//
//document.addEventListener('DOMContentLoaded',function(){});
$(document).ready(function(){
	poi();
	show_info();
	//queryhash_start()
	//queryhash();
});
//
function poi(){
	//$("<div></div>").attr('id','ddd').html('<a name="top">top</a>').prependTo('body');
	//元素开头插入内容prependTo
	//元素结尾插入内容appendTo
	//
	$("#btn01").click(function(){kamo('1');});//密林
	$("#btn02").click(function(){kamo('2');});//沙漠
	$("#btn03").click(function(){kamo('3');});//沼澤
	$("#btn04").click(function(){kamo('4');});//樹海
	$("#btn05").click(function(){kamo('5');});//火山
	$("#btn06").click(function(){kamo('6');});//潮島
}
//資料
function nanodesu(){
/*
http://mhf7.game-ss.com/Search/1/?search=%E7%8C%9F%E5%9B%A3%E3%83%88%E3%83%AC%E3%82%B8%E3%83%A3%E3%83%BC%E3%81%AE%E3%81%8A%E5%AE%9D%E7%99%BA%E8%A6%8B%E5%A0%B1%E5%91%8A%E6%9B%B8
http://blog.livedoor.jp/mh_monsoi/archives/17986509.html
http://2525charin.blog.fc2.com/blog-entry-94.html
*/
	var aryset = {
		"1":[
			["密林","備註"],
			["キラキラの傍","b01a.jpg"],
			["水辺","b01b.jpg"],
			["水辺","b01c.jpg"],
			["水辺","b01d.jpg"],
			["海が見える所","b01e.jpg"],
			["高い所","b01f.jpg"],
			["偶に行ける所","b01g.jpg"],
			["滝","b01h.jpg"],
			["水邊3-1 (水辺)","b01i.jpg"],
		],
		"2":[
			["沙漠","備註<br/>水邊6-1白天限定"],
			["砂の真ん中","b02a.jpg"],
			["砂の真ん中","b02b.jpg"],
			["安全な場所","b02c.jpg"],
			["水邊6-1 (水辺)","b02d.jpg"],
			["水辺","b02e.jpg"],
			["狹窄處(狭い所)","b02f.jpg"],
			["大岩石下 (大きな岩の下)","b02g.jpg"],
			["昏暗處","b02h.jpg"],
		],
		"3":[
			["沼澤","備註"],
			["寒い所","b03a.jpg"],
			["寒い所","b03b.jpg"],
			["水邊 (水辺)","b03c.jpg"],
			["草叢中 (草の中)","b03d.jpg"],
			["枯れ木の下","b03e.jpg"],
			["水の中","b03f.jpg"],
			
		],
		"4":[
			["樹海","備註"],
			["崖の上","b04a.jpg"],
			["水邊 (水辺)","b04b.jpg"],
			["登った上","b04c.jpg"],
			["瀑布(滝)","b04d.jpg"],
			["薄暗い所","b04e.jpg"],
			["樹樁下(切り株の下)","b04f.jpg"],
			["水邊 (水辺)","b04g.jpg"],
			["大樹下(大きな木の下)","b04h.jpg"],
		],
		"5":[
			["火山","[漂亮風景處]由8區進入到7區 (白天限定)"],
			["船隻陰影處 (舟の陰)","b05a.jpg"],
			["炎熱處 (アツアツな所)","b05b.jpg"],
			["枯樹下(枯れ木の下)","b05c.jpg"],
			["アツアツな滝","b05d.jpg"],
			["高處(高い所)","b05e.jpg"],
			["水邊 (水辺)","b05f.jpg"],
			["大岩石(大きな岩)","b05g.jpg"],
			["尖銳岩石 (トンガリ岩)","b05h.jpg"],
			["漂亮風景處 (景色の良い所)","b05i.jpg"],
		],
		"6":[
			["潮島","備註"],
			["昏暗處 (薄暗い所)","b06a.jpg"],
			["石橋上 (石の橋の上)","b06b.jpg"],
			["小小樹木(小さな木)","b06c.jpg"],
			["大きな川","b06d.jpg"],
			["折斷的樹木 (折れた木)","b06e.jpg"],
			["洞穴前(穴の前)","b06f.jpg"],
		],

		"0":[
			["測試",'http://i.mykomica.org/alichie/pixmicat.php?res=1#r490'],
		],
	}
	//{"title":"測試","image":"http://i.imgur.com/2flaE59.gifv"}, //object
	//["測試","http://i.imgur.com/2flaE59.gifv"], //array
	return aryset;
}
//
function kamo(x){
	$("#show_info").css('display','none'); //消去首頁的東西
	//
	$("#kuma01").html('');
	if( Object.keys(aryset[x]) ){
		tmp=Object.keys(aryset[x]).length;
		//console.log(tmp);
	}else{
		return 0;//停止fnc
		//console.log('stop');
	}
	//tmp= 	if(tmp ==0){return 0;}
	arylen=tmp;//資料長度
	//
	tmp=aryset;
	//console.log(tmp);
	tmp=aryset[x][0][0];
	//console.log(tmp);
	//
	gg=['','',''];
	for(i=1;i<arylen;i++){//分頁 //從1開始
		gg[0]=gg[0]+'<li><a href="#'+x+'_'+i+'">'+aryset[x][i][0]+'</a></li>';
		gg[1]=gg[1]+'<dt class="xb"><a href="#top" name="'+x+'_'+i+'" class="xa">†　</a><br/>'+aryset[x][i][0]+'</dt><dd><img src="'+aryset[x][i][1]+'?'+time+'"></dd>';
	}
	tmp='';
	//tmp=tmp+'<a name="top">top</a>';
	tmp=tmp+'<h1><ul><li><code>'+aryset[x][0][0]+'</code></li></ul></h1>';//標題
	gg[0]='<ol>'+gg[0]+'</ol>';//列表A
	gg[1]='<dl>'+gg[1]+'</dl>';//列表B
	tmp=tmp+'<blockquote>'+gg[0]+'<pre>'+aryset[x][0][1]+'</pre>'+gg[1]+'</blockquote>';
	//
	tmp='<div id="b01">'+tmp+'</div>';
	$("#kuma01").append(tmp);
}
//
function queryhash(){
	$(window).on('hashchange', function() {
		var door =location.hash.slice(1);//讀取url hash
		//console.log(door);
		//door=Number(door);
		if(door=="top"){door=0;}
		gg['door']=door;
		//
		//$(window).scrollTop(0);//畫面拉到最上方
		console.log(door);
		tmp="[name="+door+"]";
		$(".xa").css("background-color","");
		$(".xb").css("background-color","");
		$(tmp).css("background-color","#FF0000");
		$(tmp).parent().css("background-color","#B2E0FF").css("border-color", "red" );
	});
}
function queryhash_start(){
	var query = location.search.replace("?", "");
	var query2 =location.hash.slice(1);//讀取url hash
	//alert(query2);
	var a = new Array();
	a = query.split("!");
	var QUERY = new Object();
	for (i=0; i<a.length; i++) {
		var b = new Array();
		b = a[i].split('~')
		QUERY[b[0]] = unescape(b[1]);
	}
	//
	//var door= QUERY['door'];//區域變數
	var door= query2;//區域變數
	//door=Number(door);//全域變數
	if(door=="top"){door=0;}
	console.log(door);
	//
}
function show_info(){
	tmp='';
	var aryset_len=Object.keys(aryset).length;
	var aryset_len2=0
	tmp=tmp+'<ul>';
	for(i=0;i<aryset_len;i++){//分頁 //從1開始
		tmp=tmp+'<li>'+i+'</li>';
		aryset_len2=aryset[i].length;
		console.log(aryset[i]);
		tmp=tmp+'<ul>';
		for(j=0;j<aryset_len2;j++){//分頁 //從1開始
			tmp=tmp+'<li>'+aryset[i][j][0]+'</li>';
		}
		tmp=tmp+'</ul>';
	}
	tmp=tmp+'</ul>';
	$("#show_info").append(tmp);
}
</script>
</head>
<body>

<a name="top"><hr/></a>
<button id="btn01" type="button" class="btn btn-default">密林</button>
<button id="btn02" type="button" class="btn btn-default">沙漠</button>
<button id="btn03" type="button" class="btn btn-default">沼澤</button>
<button id="btn04" type="button" class="btn btn-default">樹海</button>
<button id="btn05" type="button" class="btn btn-default">火山</button>
<button id="btn06" type="button" class="btn btn-default">潮島</button>
<hr/>
<div id="kuma01"></div>
<div id="kuma02"></div>

<div id="show_info">

</div>


</body>
</html>